<template>

    <table border="1">
        <thead>
            <tr>
                <th v-for="item in title" :key="item.name">{{ item.tname }}</th>
            </tr>
        </thead>
        <tbody>
            <tr v-for="item in tItem" :key="item.id">
                <template v-for="items in title" :key="items.name">
                    <td v-if="$slots[items.name]">
                        <slot :name="items.name" :item="item">默认按键</slot>
                    </td>
                    <td v-else>
                        {{ item[items.name] }}
                    </td>
                </template>
            </tr>
        </tbody>
    </table>

</template>

<script setup>
const props = defineProps(['title', 'tItem'])


function onDel(deleteId) {
    props.tItem = props.tItem.filter(item => {
        return item.id != deleteId;
    })
}

</script>

<style lang="scss" scoped></style>